Новый зарегистрированный пользователь перенаправляется в Shopify
У меня есть проблема с процессом регистрации клиентов Shopify, которую я просто не могу решить, я надеюсь, что кто-то здесь может пролить свет на эту проблему.
Когда клиенты успешно регистрируются на нашем сайте Shopify, они перенаправляются на корневую / домашнюю страницу, что некоторое время было именно тем, чего хотел наш клиент. Теперь клиент хочет, чтобы только что зарегистрированные пользователи были доставлены на страницу учетной записи после успешной регистрации.
Из того, что я прочитал, поведение по умолчанию заключается в том, что пользователь перенаправляется на страницу учетной записи, но по какой-то причине это не происходит для нас.
Глядя на заголовки, кажется, что пользователь отправляется на страницу учетной записи, а затем сразу 302-й в корень. Учитывая, что это не стандартное поведение, мне интересно, было ли это настроено, и если да, то где?
Я не могу найти ничего в нашей теме, коде, JS, который делает это.
Я полностью сбит с толку.
[Изменить] Регистрационная форма в шопифи
{% form 'create_customer' %}
{{ form.errors | default_errors }}
<div class="input-wrapper">
<label for="FirstName" class="label-hidden">
{{ 'customer.register.first_name' | t }}
</label>
<input type="text"
name="customer[first_name]"
id="FirstName"
placeholder="{{ 'customer.register.first_name' | t }}"
autofocus
{% if form.first_name %}value="{{ form.first_name }}"{% endif %}>
</div>
<div class="input-wrapper">
<label for="LastName" class="label-hidden">
{{ 'customer.register.last_name' | t }}
</label>
<input type="text"
name="customer[last_name]"
id="LastName"
placeholder="{{ 'customer.register.last_name' | t }}"
{% if form.last_name %}value="{{ form.last_name }}"{% endif %}>
</div>
<div class="input-wrapper">
<label for="Email" class="label-hidden">
{{ 'customer.register.email' | t }}
</label>
<input type="email"
name="customer[email]"
id="Email"
class="{% if form.errors contains 'email' %}input-error{% endif %}"
placeholder="{{ 'customer.register.email' | t }}"
value="{% if form.email %}{{ form.email }}{% endif %}"
spellcheck="false"
autocomplete="off"
autocapitalize="off">
</div>
<div class="input-wrapper">
<label for="CreatePassword" class="label-hidden">
{{ 'customer.register.password' | t }}
</label>
<input type="password"
name="customer[password]"
id="CreatePassword"
class="{% if form.errors contains 'password' %}input-error{% endif %}"
placeholder="{{ 'customer.register.password' | t }}">
</div>
<div class="input-wrapper">
<label for="PrivacyPolicy" class="label-hidden">
<input type="checkbox"
name="customer[note][Privacy Policy]"
id="PrivacyPolicy"
value="Accepted on {{ "now" | date: "%Y-%m-%d" }}" />
I have read, understood and agree to the <a href="/pages/privacy-policy" target="_blank">Privacy Policy</a>.
</label>
</div>
<div class="input-wrapper">
<button disabled type="submit" class="button--primary" id="create_customer__submit">{{ 'customer.register.submit' | t }}</button>
</div>
<a href="{{ shop.url }}">{{ 'customer.register.cancel' | t }}</a>
{% endform %}
Я видел, что добавление следующего было предложено в качестве возможного исправления, но в моем случае это не имело никакого значения.
<input type="hidden" name="checkout_url" value="/account">
Через инспектора я вижу, что форма отправляется в "/account", а затем перенаправляется (302) в "/"
Форма выше предоставляет
<form method="post" action="/account" id="create_customer" accept-charset="UTF-8">
<input type="hidden" name="form_type" value="create_customer" />
....
....
<div class="input-wrapper">
<button disabled type="submit" class="button--primary" id="create_customer__submit">Create</button>
</div>
</form>
1 ответ
Вы можете опубликовать форму с помощью Ajax, а затем в случае успеха перенаправить на страницу учетной записи.
Пример приведен ниже:
$('form#create_customer').on('submit', function(event){
//debugger;
event.preventDefault();
var postUrl = $(this).attr('action');
var postData = $(this).serialize();
//console.log(postData); check what your form posts
$.ajax({
type: "POST",
url: postUrl,
data: postData,
dataType: "json",
success: function(data) {
console.log('Account created')
//redirect to somewhere
window.location.replace("/some-url");
},
error: function() {
console.log('error handling here');
}
});
});
Вот что я использую для перенаправления пользователей после регистрации (с проверкой по капче или без нее):
window.addEventListener("load", function (event) {
var redirectInput = document.createElement('input'),
registerSubmit = document.querySelector('#create_customer input[type="submit"]'),
registerForm = document.querySelector('#create_customer'),
captchaSubmit = document.querySelector('.shopify-challenge__container input[type="submit"]'),
captchaForm = document.querySelector('#g-recaptcha');
redirectInput.setAttribute('type', 'hidden');
redirectInput.setAttribute('name', 'return_to');
redirectInput.setAttribute('value', '/account'); //URL to redirect
if (registerForm.length) {
registerSubmit.insertAdjacentElement("beforebegin", redirectInput)
} else if (captchaForm.length) {
captchaSubmit.insertAdjacentElement("beforebegin", redirectInput)
}
});
Я закончил обработку отправки формы с помощью jquery. Я видел несколько примеров и это на сайте Shopify, особенно этот https://ecommerce.shopify.com/c/ecommerce-design/t/redirect-after-customer-registration-370825 и взломал его немного. Я положил следующее в нижней части страницы учетной записи, и это работает удовольствие.
Async не был вариантом для меня, но вполне может быть ответом для некоторых людей.
(function() {
'use strict';
function handleSumission(event) {
event.preventDefault();
var data = $(this).serialize();
$.post('/account', data)
.done(function(data) {
var errorsLog = $(data).find('.errors').text();
// Show any errors that there may be
if(errorsLog != "" && errorsLog != 'undefined') {
// Do error handling here
} else {
window.location.href = '/account';
}
})
.fail(function() {
// Tidy up if it fails
});
}
function init() {
$('#create_customer').on('submit', handleSumission);
}
window.addEventListener('load', init);
}());