출발지가 Access-Control-Allow-Origin에서 허용되지 않습니다.

출발지가 Access-Control-Allow-Origin에서 허용되지 않습니다.

XMLHttpRequest cannot load http://localhost:8080/api/test. Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin. 

크로스 도메인 에이잭스 요청에 대해 읽고 근본적인 보안 문제를 이해했습니다.제 경우, 2대의 서버가 로컬로 실행되고 있으며 테스트 중에 교차 도메인 요청을 사용할 수 있습니다.

localhost:8080 - Google Appengine dev server
localhost:3000 - Node.js server

를 발행합니다.localhost:8080 - GAE server내 페이지가 노드 서버에서 로드되는 동안.한가(Don with （ Chrome ） 。disable-web-security옵션)을 클릭합니다. 바꾸어야 'Content-Type'드드서 버버 ??? ??? ★★★★★★★★★★★★★★★★★★?

JavaScript가 됩니다.origin같은 머신/호스트명에 있는 것은 문제가 되지 않습니다.

서버에서 CORS를 활성화해야 합니다(localhost:8080).다음 사이트를 확인해 주세요.http://enable-cors.org/

HTTP 헤더를 서버에 추가하기만 하면 됩니다.

Access-Control-Allow-Origin: http://localhost:3000

또는 단순화를 위해:

Access-Control-Allow-Origin: *

할 때 cookie를 사용하는 를 사용하지 withCredentials = true

credential 요구에 응답할 때 서버는 도메인을 지정해야 하며 와일드카드를 사용할 수 없습니다.

것은, 을 .withCredentials

Chrome에서 Ajax 요청을 신속하게 처리해야 하는 경우 이 Chrome 플러그인은 적절한 응답 헤더를 추가하여 모든 소스에서 모든 사이트에 자동으로 액세스할 수 있도록 합니다.

Chrome 확장 허용-제어 허용-원점: *

이 문제를 해결하려면 CORS를 활성화해야 합니다.

앱이 simple node.dell로 작성되어 있는지 확인합니다.

다음과 같이 응답 헤더에 설정합니다.

var http = require('http');

http.createServer(function (request, response) {
response.writeHead(200, {
    'Content-Type': 'text/plain',
    'Access-Control-Allow-Origin' : '*',
    'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE'
});
response.end('Hello World\n');
}).listen(3000);

앱이 express 프레임워크로 만들어진 경우

같은 CORS 미들웨어를 사용하다

var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', "*");
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    next();
}

를 통해 신청합니다.

app.configure(function() {
    app.use(allowCrossDomain);
    //some other code
});    

여기 2개의 참조 링크가 있습니다.

1. How-to-allow-in-module-nodejs의 설정
2. diving-into-node-js-very-first-app # "Ajax" 섹션 참조

@Rocket hazmat의 답변은 해결책으로 이어지기 때문에 받아들입니다.헤더를 설정하기 위해 필요한 것은 GAE 서버입니다.이걸 세팅해야 했어요

"Access-Control-Allow-Origin" -> "*"
"Access-Control-Allow-Headers" -> "Origin, X-Requested-With, Content-Type, Accept"

, 「」만"Access-Control-Allow-Origin"를 주다

Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers.

또한 인증 토큰을 전송해야 할 경우 이것도 추가합니다.

"Access-Control-Allow-Credentials" -> "true"

에서는, 「 」, 「 」를 설정합니다.withCredentials

는 "이러한 요구", 2개는 "이러한 요구"입니다.★★★★★★★★★★★★★★★★★★,OPTIONSauth cookie 。

router.js에서는 get/post 메서드를 호출하기 전에 코드를 추가합니다.오류 없이 작동됩니다.

//Importing modules @Brahmmeswar
const express = require('express');
const router = express.Router();

const Contact = require('../models/contacts');

router.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
  });

express를 사용하는 경우 다음과 같이 코르스 미들웨어를 사용할 수 있습니다.

var express = require('express')
var cors = require('cors')
var app = express()

app.use(cors())

Chrome의 Ajax를 사용하여 크로스 오리진 리소스를 호출하는 동안 문제가 발생했습니다.

노드 js와 로컬 http 서버를 사용하여 노드 js 앱을 배포했습니다.

크로스 오리진 리소스에 액세스할 때 오류 응답을 받았습니다.

나는 그것에 대한 해결책을 하나 찾았다.

1) 아래 코드를 app.js 파일에 추가하였습니다.

res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");

2) cross origin resources라는 이름의 html 페이지에서$.getJSON();

$.getJSON("http://localhost:3000/users", function (data) {
    alert("*******Success*********");
    var response=JSON.stringify(data);
    alert("success="+response);
    document.getElementById("employeeDetails").value=response;
});

다음 Import에서 NodeJS 서버에 추가합니다.

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

그 후 403이 되면 WEB의 필터를 줄여주세요.XML Tomcat 설정을 다음에 나타냅니다.

<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
  <init-param>
    <param-name>cors.allowed.origins</param-name>
    <param-value>*</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.methods</param-name>
    <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.headers</param-name>
    <param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
  </init-param>
  <init-param>
    <param-name>cors.exposed.headers</param-name>
    <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
  </init-param>
</filter>

솔루션을 찾는 사람이 있는 경우 express를 사용하는 것이 빠른 해결책입니다.

const express = require('express')
const cors = require('cors')
const app = express()

1) npm을 사용하여 Cors를 설치합니다.npm install cors --save

2) Import [ ]const cors = require('cors')

3) 미들웨어로 사용app.use(cors())

자세한 내용은 코르사의 사용법을 참조하십시오.그게 다야, 잘 됐으면 좋겠는데.

드디어 Apache Tomcat8에 대한 답을 얻었다.

Tomcat web.xml 파일을 편집해야 합니다.

아마 그것은 webapps 폴더 안에 있을 것이다.

sudo gedit /opt/tomcat/webapps/your_directory/WEB-INF/web.xml

찾아서 편집하다

<web-app>


<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
  <init-param>
    <param-name>cors.allowed.origins</param-name>
    <param-value>*</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.methods</param-name>
    <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.headers</param-name>
    <param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
  </init-param>
  <init-param>
    <param-name>cors.exposed.headers</param-name>
    <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
  </init-param>
  <init-param>
    <param-name>cors.support.credentials</param-name>
    <param-value>true</param-value>
  </init-param>
  <init-param>
    <param-name>cors.preflight.maxage</param-name>
    <param-value>10</param-value>
  </init-param>
</filter>


<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>



</web-app>

그러면 모든 호스트에서 Access-Control-Allow-Origin이 허용됩니다.모든 호스트에서 호스트만으로 변경해야 하는 경우

<param-name>cors.allowed.origins</param-name>
<param-value>http://localhost:3000</param-value>

위의 코드를 *에서 http://your_public_IP 또는 http://www.example.com로 전송합니다.

여기서 Tomcat 필터 매뉴얼을 참조해 주세요.

감사합니다.

router.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Methods", "*");
res.header("Access-Control-Allow-Headers", "*");
next();});

프런트 엔드에서 콜하고 있는 루트에 이것을 추가합니다.예를 들어 http://localhost:3000/users/register를 호출할 경우 이 루트가 배치되어 있는 백엔드 .js 파일에 이 코드 fragment를 추가해야 합니다.

PHP의 경우 헤더를 설정할 때 사용합니다.

header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: PUT, GET, POST");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");

안녕하세요, 이것은 노드에서 CORS 문제를 해결하는 방법입니다.Node.js(또는 서버 파일)의 서버 "api" 쪽에 이러한 행을 추가하면 "cors"를 설치할 수 있습니다.

    const express = require('express');
    const app = express();
    app.use(express.json());
    var cors = require('cors');
    app.use(cors());

서버가 다음과 같은 경우server=express()덧붙이기만 하면 된다server.use(cors())다음 행으로 이동합니다.예:

server.js

const express = require('express')
const cors = require('cors')
server=express()
server.use(cors())

server.get('/',(req,res)=>{
    res.send({"name":"aakash","name2":"aakash4dev"})
})
server.listen(3000)

index.html

<script>
    fetch('http://localhost:3000/')
  .then(res=> res.json())
  .then(data => console.log(data))
</script>

dataType: 'jsonp'를 사용합니다.

   async function get_ajax_data(){

       var _reprojected_lat_lng = await $.ajax({

                                type: 'GET',

                                dataType: 'jsonp',

                                data: {},

                                url: _reprojection_url,

                                error: function (jqXHR, textStatus, errorThrown) {

                                    console.log(jqXHR)

                                },

                                success: function (data) {

                                    console.log(data);



                                    // note: data is already json type, you just specify dataType: jsonp

                                    return data;

                                }

                            });





 } // function               

express를 사용하는 경우,

var express = require('express')
var cors = require('cors')
var app = express()
app.use(cors())

사용하시는 경우app.use(express.json());JSON payload를 사용하여 착신 요구를 해석하는 서버 파일의 코드 행으로, 본문 파서에 근거하고 있습니다.사용 후 사용하는 것에 주의해 주세요. app.use(cors())코드 라인그렇지 않으면 보안 문제가 발생할 수 있습니다.코르스

Google Chrome을 사용하는 경우 다음 추가 기능을 설치해 보십시오.

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi/related

언급URL : https://stackoverflow.com/questions/18642828/origin-origin-is-not-allowed-by-access-control-allow-origin