Phần I: Cross-domain request trong javascript là gì ?

Chào các bạn trong bài viết này, chúng ta sẽ cùng nhau làm rõ một khái niệm khá là thường gặp trong lập trình web “Cross-domain request“.

crd1

 

Nếu như bạn đang lập trình với các ứng dụng web thì chắc hẵn bạn đã từng:

  • Sử dụng javascript ở phía client side
  • Tương tác với API được cung cấp bởi các services bên ngoài
  • Hoặc đã từng thấy dòng lỗi này ở console của browser

XMLHttpRequest cannot load http://external.service/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://my.app' is therefore not allowed access.

Mỗi khi mà chúng ta cần tương tác với các service bên ngoài – điển hình nhất là các API mà không phải do chính chúng ta tạo ra thì thường xuất hiện lỗi như trên. Và tôi tin các bạn cũng đôi lúc gặp vấn đề này.

Same-Origin Policy

sop

Chúng ta thường thấy lỗi như trên lý do là vì chúng ta vi phạm cái được gọi là Same-Origin Policy (SOP). Đây là một tiêu chuẩn về bảo vệ được tích hợp trong các browsers nhầm ngăn chặn việc tương tác giữa các Documents hoặc Script nằm ở các Origin (hoặc địa chỉ) khác nhau.

Origin của một trang web được xác định bởi Protocol, HostPort.

Ví dụ như Origin của Tôi Thắc Mắc là ‘http’ => Protocol, ‘toithacmac’ => host / domain, 80 => port.

Với các tài nguyên mà có chung Origin thì giữa các tài nguyên được truy cập hoàn toàn lẫn nhau. Nếu trang A và B có chung Origin, thì đoạn mã javascript ở A có thể thực hiện một http request đến server B và tương tác với DOM của B hoặc thậm chí là đọc cookies ở B.

Cross-domain request / Cross-Origin HTTP request là gì ?

Nói một cách nôm na đó là các thuật ngữ dùng để chỉ việc tương tác giữa các website khác Origin với nhau. Như đã nói ở trên, gần gũi nhất là những thao tác mà lập trình viên hay tương tác với các service bên ngoài thông qua các interface API.

Vậy Cross-domain request và Same-origin Policy có liên quan gì đến nhau không ? 

Câu trả lời là có. Như đã nói SOP là một tiêu chuẩn bảo vệ nên nó đưa ra các quy tắc chung liên quan đến hoạt động của Cross-domain request. Cụ thể:

Cross-domain “Writes” thì cho phép còn Cross-domain “Reads” thì không

Điều trên có nghĩa là nếu A và C ở hai Origin khác nhau thì HTTP request được tạo ra ở A sẽ nhận được chính xác ở C => Đây gọi là “Writes”, nhưng những script đang chứa ở A thì không thể đọc được bất kỳ Data hoặc thậm chí là đoạn code nào trả về từ phía C => Đây gọi là “Read”, cũng từ đây là nguyên nhận dẫn đến lỗi như đã nói ở trên. Tóm lại, SOP sẽ không ngăn chặn việc “Writes” Data đến các Origin mà chỉ ngăn chặn việc “Reads” Data từ các Origin đó.

=> SOP rất tuyệt vời. Nó ngăn chặn các đoạn mã độc từ việc đọc data được gửi về từ các Origin khác. 

 

 

Còn tiếp Phần II: Các cách thức để thực hiện việc cross-domain request

 

Advertisements

2 thoughts on “Phần I: Cross-domain request trong javascript là gì ?

Trả lời

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Đăng xuất /  Thay đổi )

Google photo

Bạn đang bình luận bằng tài khoản Google Đăng xuất /  Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Đăng xuất /  Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Đăng xuất /  Thay đổi )

Connecting to %s