How does the front end use nginx to solve cross-domain problems?

The

project is done with jq and bootstrap.
I set up a local server. The address of the page is http://localhost:8080,
, and then when I develop, the API interface address that my front end initiates the request is http://localhost:8000
, but the backend address is 192.168.1.134jq 9111. How should I configure it? In this way, the configuration still reports an error (the chrome browser opens the network panel, and the API returns 200, but there is no data, but the console error: prompt: cross-domain, prompt: has been blocked by CORS policy: No "Access-Control-Allow-Origin" header is present on the requested resource. ):

        listen 8000;
        server_name localhost;
        location /{
            proxy_pass http://192.168.1.134:9111/;  
                    
        }
    }
Sep.27,2021

there seems to be nothing wrong with the configuration. Take a look at the nginx log


try it:

//config/index.js:
module.exports = {
  dev: {

    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
      '/api': {
        target: 'http://192.168.1.134:9111/',
        changeOrigin: true,
        pathRewrite: {
          '^/api': '/api'
        }
      }
    },
    

you need to see which interfaces need to deal with cross-domain, and the page itself does not need to cross-domain

for example, all your interfaces contain api ,

.
http://1.1.1.1/api/getlist

http://1.1.1.1/api/login

like this, you need to match api so that all requests containing api are forwarded to the server you need

.
server {
       listen       443;
       server_name  blog.codelabo.cn;
       ssl_session_timeout  5m;
       ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
       ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
       ssl_prefer_server_ciphers  on;
       location / {
           root   /usr/local/src/web-app/www/blog;
           index  index.html index.htm;
           try_files $uri /index.html;
           expires 1d;
       }
       location /api {
            proxy_pass http://localhost:8888;
        }
    }

if your interface is irregular, then you can only change to this matching rule

location ~ ^/(GetRootContents|GetAssociatedFolderContents|GetRetrieveContent|GetFolderContents|GetItemData|getPlayURL|GetChannels|GetPrograms|SearchAction|GetComments|GetChaUserCommentnnels|Login|LoginOut|BindCard|Register|ModUserInfo|GetSearchHotKeywords|GetBookmarks) {
            proxy_pass http://120.77.8.170:8080;
        }

I hope it works for you, thank you


https://codeshelper.com/a/11.. You can refer to


this configuration is fine. Ask the backend if there are any additional restrictions on the request. First, use postman to test whether the API itself is OK.

Menu