Skip to content

[js] 第84天 请描述你对浏览器同源策略的理解 #590

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

第84天 请描述你对浏览器同源策略的理解

Activity

ghost

ghost commented on Jul 9, 2019

@ghost

同源策略是指,某个页面上执行的 AJAX/Fetch 请求只能访问到同域名下的 URL。
这是出于安全性考虑,然而在某些需要跨域的场景中,通过在服务端设置 CORS 响应头 Access-Control-Allow-Origin(允许的来源域名)、Access-Control-Allow-Method(允许的 HTTP Method)等,可以响应来自其他域的请求。

dondonZh

dondonZh commented on Jul 9, 2019

@dondonZh

解决同源策略:
1.代理转发
2.服务端设置 Access-Control-allow-Origin Access-Control-Allow-Method

nowherebutup

nowherebutup commented on Jul 9, 2019

@nowherebutup

出于浏览器的安全考虑,避免沾染其他域的恶意文件代码,只有协议,域名,端口都相同的文档才能被读写;
解决同源策略的方法:

  • CORS(跨域资源共享),在服务端设置Access-Control-Allow-Origin等相关的属性
  • 利用proxy设置转发请求
daisybaicai

daisybaicai commented on Jul 9, 2019

@daisybaicai

浏览器有同源策略,不允许ajax访问其他域接口。
协议,域名,端口一个不同就是跨域。

解决跨域:
1.img,src,link的标签跨域跨域。
2.JSONP也可以跨域
3.http header设置Access-Control-Allow-Origin/Headers/Methods.

pokerLife

pokerLife commented on Jul 9, 2019

@pokerLife

摘自谷歌:

同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。 可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。 同源策略,它是由Netscape提出的一个著名的安全策略。

同源的三个要素

  • 协议相同
  • 端口相同
  • 域名相同

跨域的方式包括:后端设置header、JSONP、正向代理、CORS、WebSocket等。

AnsonZnl

AnsonZnl commented on Jul 9, 2019

@AnsonZnl
Contributor

为了安全,浏览器同源策略是指,某个页面上执行的 AJAX请求只能访问到同域名下同端口的 URL。
请求的地址,协议 域名 端口 有一个不一样就会发生跨域,解决跨域一般使用jsonp或者服务端设置Response header Access-control-Allow-Origin
参考:https://www.jianshu.com/p/89a377c52b48

lizhesystem

lizhesystem commented on Jun 27, 2020

@lizhesystem

概念:只要协议、域名、端口有任何一个不同,都被当作是不同的域。

什么是跨域:

  • 跨域请求不是JS限制的,是浏览器的同源策略所限制(可以把同源策略当成浏览器的一种约定,安全策略)
  • 目的是从一个服务去请求另外一个域名和端口不一样的服务从而拿到所需要的数据。(一半用于调用别人的接口数据等),
smile-2008

smile-2008 commented on Feb 24, 2021

@smile-2008

浏览器有同源策略,不允许ajax访问其他域接口。
协议,域名,端口一个不同就是跨域。

解决跨域:
1.img,src,link的标签跨域跨域。
2.JSONP也可以跨域
3.http header设置Access-Control-Allow-Origin/Headers/Methods.

xiaoqiangz

xiaoqiangz commented on Jun 22, 2022

@xiaoqiangz

浏览器同源指的是:端口、域名、协议三种必须是相同,如果一种不同就相当于是不同的域,http请求就会跨域,如果要解决可以用jsonp、后端配置header请求头Access-control-Allow-origin、nginx配置反向代理。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    jsJavaScript

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @smile-2008@haizhilin2013@xiaoqiangz@dondonZh@pokerLife

        Issue actions

          [js] 第84天 请描述你对浏览器同源策略的理解 · Issue #590 · haizlin/fe-interview