The Same Origin Policy / Chapter 07 of 14

Same Origin Policy to Forms

Same Origin Policy to Forms in Pankaj Mouriya's Same Origin Policy guide.

All chapters ↘
  1. 01 / Introduction
  2. 02 / What should be Allowed?
  3. 03 / Same Origin Policy
  4. 04 / Access Different Orgins
  5. 05 / Same Origin Policy in Tabs
  6. 06 / Same Origin Policy to Anchors
  7. 07 / Same Origin Policy to Forms
  8. 08 / Same Origin Policy to Images and CSS
  9. 09 / Same Origin Policy to JavaScript
  10. 10 / Same Origin Policy to Web Storage
  11. 11 / Same Origin Policy to Cookies
  12. 12 / Getting Around Same Origin Policy
  13. 13 / postMessage API Implementation and limitations
  14. 14 / References

Forms work in same fashion as anchors or vice versa.

When a user submits a form, say when user make a POST request to siteb.com by submitting the form. The response loads in new context, the orginating site is replaced by the site where the action is defined.

Code
<form action="http://store.sitea.com" class="form-signin">
          <h1 style="text-align: center;" class="h2 mb-6 font-weight-normal">Login to buy Gifts</h1><br>
          <label for="inputEmail" class="sr-only">Email address</label>
          <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
          <label for="inputPassword" class="sr-only">Password</label>
          <input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
          <div class="checkbox mb-3">
            <label>
              <input type="checkbox" value="remember-me"> Remember me
            </label>
          </div>
          <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
          
        </form>

Conclusion - Any website can make a POST request, but can't read the response in same context.

Same Origin Policy to Forms, figure 1